<template>
   <div class="modal fade" id="patientnotemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title" id="myModalLabel">
                会员姓名：{{patientnotename}}</h4>
                    </div>
                    <div class="modal-body" id="patientnotetable">
                        <table class="table table-hover" >
                        <tr>
                            <th>日期</th>
                            <th>状况记录</th>
                        </tr>
                        <tr v-for="item in patientnotelist">
                            <td>{{item.noteTime}}</td>
                             <td>{{item.note}}</td>
                        </tr>
                        <tr v-if="pagesshow">
                            <td colspan="2">
                                <div class="pull-left">
                                    <button class="secondBtn" @click="refresh">刷新</button>
                                </div>
                                <div class="pull-right">
                                    <boot-page v-ref:page :async="true" :lens="lenArr" :page-len="pageLen" :headersparam="patientnoteheadersparam" :param="patientnoteparam" :len="len"></boot-page>
                                </div>
                            </td>
                        </tr>
                    </table>
                    </div>
                </div>
            </div>
        </div>
</template>
<script>
import Public from 'assets/public.js'
import bootPage from 'components/BootPage.vue'

export default {
    data() {
            return {
                lenArr: [10, 20, 50], // 每页显示长度设置
                pageLen: 5, // 可显示的分页数
                // headersparam: {
                //     "X-Service-Id": "coms.memberService",
                //     "X-Service-Method": "findPersonUserInfo",
                // },
                len:5,
                patientnotelist:[],
                patientnoteheadersparam: {
                    "X-Service-Id": "coms.workDailyService",
                    "X-Service-Method": "queryPatientNoteListByMpiId",
                },
                patientnoteparam:{
                     mpiId: "",

                 },
                 patientnotename:"",
                 pagesshow:false,

            }
        },
        computed:{

        },
        components: {
            bootPage
        },
        ready() {
            var that = this;

        },
        methods: {
                // 列表页面刷新按钮
                refresh() {
                     this.$refs.page.refresh()
                },
                getlist(item){
                    this.patientnotename=item.person.personName;
                    this.patientnoteparam.mpiId=item.person.mpiId;
                     $("#patientnotemodal").modal("show");
                     this.pagesshow=true;//防止二次请求
                     this.refresh();
                }
        },
        props: {
            // patientnoteparam: {
            //     type: Object,
            //     default: {
            //         mpiId: "",
            //     }
            // },
            // patientnotename: {
            //         type: String,
            //         default: ""
            //     },
        },
        events: {
            // 分页列表数据
            'data' (data) {
                if(data.length>0){

                    $.each(data,function(index, el) {
                        el.noteTime=el.noteTime.substring(0,10)
                    });
                }
                this.patientnotelist = data;
            },


        },
}
</script>
<style scoped>
#patientnotetable .table>tbody>tr>th{border-top: none}
#patientnotetable .table>tbody>tr>td:nth-child(1){width: 120px}
.modal-content{min-height: 600px}
</style>
